import Vue from 'vue'
import Router from 'vue-router'

// import Home from '../pages/home/Home'
// import Search from '../pages/search/Search'
// import Order from '../pages/order/Order'
// import Personal from '../pages/personal/Personal'
import Login from '../pages/login/Login'
import Shop from '../pages/shop/Shop'
import ShopGoods from '../pages/shop/shopgoods/ShopGoods'
import ShopInfo from '../pages/shop/shopinfo/ShopInfo'
import ShopRatings from '../pages/shop/shopratings/ShopRatings'
// 路由懒加载只针对最外层的路由就好 自由路没必要加载
const Home = () => import('../pages/home/Home')
const Search = () => import('../pages/search/Search')
const Order = () => import('../pages/order/Order')
const Personal = () => import('../pages/personal/Personal')

Vue.use(Router)

export default new Router({
  // mode: 'history', // 访问路径不带井号 需要使用 history模式,需要后台配置，否则后台调值的时候回出现错误
  // base: '/', // 页面基础路径，默认为'/',项目在api子目录的时候配置，/ap/ 两边斜杠要加，
  routes: [
    {
      path: '/',
      redirect: '/home' // 路由重定向
    },
    {
      path: '/home',
      name: 'Home', // 返回路由组件的函数，只有执行函数才会加载路由组件，这个函数在请求对应的路由路径才会执行
      component: Home,
      meta: {
        requireAuth: true, // 添加该字段代表该路由需要登录
        showFooter: true // 为true的时候显示底部导航栏
      }
    },
    {
      path: '/search',
      name: 'Search',
      component: Search,
      meta: {
        showFooter: true // 为true的时候显示底部导航栏
      }
    },
    {
      path: '/order',
      name: 'Order',
      component: Order,
      meta: {
        showFooter: true
      }
    },
    {
      path: '/personal',
      name: 'Personal',
      component: Personal,
      meta: {
        showFooter: true
      }
    },
    {
      path: '/login',
      name: 'Login',
      component: Login
    },
    {
      path: '/shop',
      name: 'Shop',
      component: Shop,
      redirect: '/shop/goods', // 路由重定向,跳转到goods中
      children: [ // shop下的子路由 , shop下的路由不能加/，否则会找到根目录
        {
          path: 'goods',
          name: 'ShopGoods',
          component: ShopGoods
        },
        {
          path: 'info',
          name: 'ShopInfo',
          component: ShopInfo
        },
        {
          path: 'ratings',
          name: 'ShopRatings',
          component: ShopRatings
        }
      ]
    }
  ],
  scrollBehavior (to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition // 返回上次浏览的位置，在按下 后退/前进 按钮时，就会像浏览器的原生表现那样
    } else {
      return {
        x: 0,
        y: 0
      }
    }
  }
})
